<style>
    #sin-chart-t,#sin-chart-p{
        width:100%;
    }
</style>
<!-- MAIN CONTENT -->
<div id="content">
    <!--头部-->
    <!--<div class="margin-bottom-10 clearfix padding-bottom-10" style="border-bottom: 2px solid black">
        <div class="pull-left">
            <strong class="font-lg txt-color-darken"><i class="glyphicon glyphicon-dashboard" style="vertical-align: middle"></i>设备信息</strong>
        </div>
        <div class="pull-right margin-left-10">
            <strong class="font-lg">
                <i class="glyphicon glyphicon-ok-sign" style="vertical-align: middle;color: #709B70"></i>
                正常设备：<span style="background: #709B70;color: white;font-weight: 700;padding: 0 5px;border-radius: 3px">108</span>
            </strong>
        </div>
        <div class="pull-right margin-left-10">
            <strong class="font-lg">
                <i class="glyphicon glyphicon-info-sign" style="vertical-align: middle;color: #A10228"></i>
                报警设备：<span style="background: #A10228;color: white;font-weight: 700;padding: 0 5px;border-radius: 3px">108</span>
            </strong>
        </div>
        <div class="pull-right margin-left-10">
            <strong class="font-lg">
                <i class="glyphicon glyphicon-record" style="vertical-align: middle;color: #3176B1"></i>
                设备总数：<span style="background: #3176B1;color: white;font-weight: 700;padding: 0 5px;border-radius: 3px">108</span>
            </strong>
        </div>
    </div>-->

    <div smart-include="app/yksensor/views/sub-header.tpl.html"></div>
    <!--头部end-->
    <div class="clearfix margin-bottom-10">
        <div class="pull-left">
            <strong class="font-md">油罐编号：</strong>
            <input type="text" style="vertical-align: middle" id="deviceid_s" >
        </div>
        <!--<div class="pull-left margin-left-25">
            <strong class="font-md">时间范围：</strong>
            <input type="date" style="vertical-align: middle" id="time_s" >
            -
            <input type="date" style="vertical-align: middle"  id= "time_e">


            <a class="btn btn-primary"   id="search" >查询</a>
        </div>-->
        <div class="pull-left margin-left-25">

            <strong class="font-md">时间范围：</strong>
            <label class="input">
                <input type="text" name="startdate" id="time_s" placeholder="开始日期：">
                <i class="icon-append fa fa-calendar"></i>
            </label>
            -
            <label class="input">
                <input type="text" name="finishdate" id="time_e" placeholder="结束日期：">
                <i class="icon-append fa fa-calendar"></i>
            </label>
            <!--<input type="date" style="vertical-align: middle" ng-model="paginationConf.timefrom">
        -
        <input type="date" style="vertical-align: middle" ng-model="paginationConf.timeto">-->
            <a class="btn btn-primary" href-void="" id="search">查询</a>

        </div>
        <!-- <div class="pull-right">
            <button class="btn btn-primary glyphicon glyphicon-export" > 导出</button>
        </div> -->
    </div>
    <section id="widget-grid" class="">

           <!-- row -->
        <div class="row">

            <!-- NEW WIDGET START -->
            <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">

                <!-- Widget ID (each widget will need unique ID)-->
                <div class="jarviswidget" id="levelmeter" data-widget-editbutton="false" style="display:none">
                    <header>
                        <span class="widget-icon"> <i class="fa fa-bar-chart-o"></i> </span>
                        <h2>液位</h2>

                    </header>

                    <!-- widget div-->
                    <div>

                        <!-- widget edit box -->
                        <div class="jarviswidget-editbox">
                            <!-- This area used as dropdown edit box -->

                        </div>
                        <!-- end widget edit box -->
                        <!-- widget content -->
                        <div class="widget-body no-padding">

                            <div id="sin-chart-p" class="chart has-legend"></div>

                        </div>
                        <!-- end widget content -->

                    </div>
                    <!-- end widget div -->

                </div>
                <!-- end widget -->
                <!-- Widget ID (each widget will need unique ID)-->
                <div class="jarviswidget" id="flowmeter" data-widget-editbutton="false" style="display:none">
                   
                    <header>
                        <span class="widget-icon"> <i class="fa fa-bar-chart-o"></i> </span>
                        <h2>温度曲线</h2>

                    </header>

                    <!-- widget div-->
                    <div>

                        <!-- widget edit box -->
                        <div class="jarviswidget-editbox">
                            <!-- This area used as dropdown edit box -->

                        </div>
                        <!-- end widget edit box -->
                        <!-- widget content -->
                        <div class="widget-body no-padding">

                            <div id="sin-chart-t" class="chart has-legend"></div>

                        </div>
                        <!-- end widget content -->

                    </div>
                    <!-- end widget div -->

                </div>
                <!-- end widget -->
              

            </article>
            <!-- WIDGET END -->

        </div>

        <!-- end row -->
        <!-- row -->
      
        <div class="row">
            <div class="col-sm-12">
                <div class="panel panel-default">
                    <div class="panel-body status">
                        <div class="who clearfix" style="padding:8px 20px;">
                            <h5>温度计 温度曲线</h5>
                        </div>
                        <div class="clearfix">
                            <div class="text">
                                <div class="row" id="choices">
                                    <!-- <div class="col-xs-4 col-md-3 col-lg-2" ng-repeat="thermo in thermoInfo.thermometer">
                                        <div class="well text-center connect"> -->
                                            <!-- <img src="styles/img/avatars/gril1.png" alt="img" class="margin-bottom-5 margin-top-5"> -->
                                            <!-- <div class="margin-bottom-5 margin-top-5" style="border-radius:50% 50% 0; background:#2b92ea; width:50px; height:50px; display:inline-block">
                                                <strong style="color:#fff; line-height:50px;">{{thermo.temp}}°C</strong>
                                            </div>
                                            <br>
                                            <span class="font-xs"><b>温度计{{thermo.tid}}（{{thermo.high}}m）</b></span>
                                            <br> -->
                                            <!-- <a href="javascript:void(0);" class="btn btn-xs btn-primary margin-top-5 margin-bottom-5">
                                                <i class="glyphicon glyphicon-eye-open"></i> 
                                            </a>
                                            <a href="javascript:void(0);" class="btn btn-xs btn-default margin-top-5 margin-bottom-5">
                                                <i class="glyphicon glyphicon-eye-close"></i> 
                                            </a>
                                            <br> -->
                                            <!-- <span class="onoffswitch">
                                                <input type="checkbox" name="thermometer-{{thermo.tid}}" class="onoffswitch-checkbox ng-untouched ng-valid ng-dirty ng-valid-parse" id="thermometer-{{thermo.tid}}">
                                                <label class="onoffswitch-label" for="thermometer-{{thermo.tid}}">
                                                    <span class="onoffswitch-inner" data-swchon-text="显示" data-swchoff-text="隐藏"></span>
                                                    <span class="onoffswitch-switch"></span>
                                                </label>
                                            </span>
                                        </div>
                                    </div> -->
                                </div>
                            </div>
                        </div>
                        <!-- <ul class="links text-right">
                            <li class="">
                                <a href="javascript:void(0);">Find people you know <i class="fa fa-arrow-right"></i> </a>
                            </li>
                        </ul> -->
                        <div class="links" style="padding:5px;">
                            <div id="tempcharts" class="chart has-legend" style="height:350px;"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end widget grid -->


</div>
<!-- END MAIN CONTENT -->
